<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Quark Framework Example - ImageLoader</title>

<style type="text/css">
body{margin:0;padding:0;font-size:12px;background-color:#eee;}
</style>

<script type="text/javascript" src="../js/quark.base-1.0.0.js"></script>

</head>

<body>

<div id="container" style="position:absolute;left:0;top:0;width:480px;height:320px;background-color:#fff;"></div>
<div id="fps" style="position:absolute;left:0;top:0;"></div>

<script type="text/javascript">

var loader = new Quark.ImageLoader();
loader.addEventListener("loaded", onLoad);
loader.addEventListener("complete", onComplete);	
loader.load([{id:"girl", src:"images/girl.png", size:51}, {id:"boy", src:"images/boy.png", size:72}]);

function onLoad(e)
{
	trace(e.target.getLoadedSize(), e.target.getTotalSize(), e.image.src);
}

function onComplete(e)
{
	trace(e.images.girl.image);
}

</script>

</body>
</html>